<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>升学率</title>
    <link rel="stylesheet" href="/css/layui.css">
</head>
<body>
<form class="layui-form" method="post">
    <div class="layui-inline">
        <div class="layui-input-inline" style="width: 200px">
            <input type="text" id="keyLine" name="keyLine" lay-verify="required" lay-reqText="请输入重点本科线" placeholder="请输入重点本科线" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="width: 200px" >
            <input type="text" id="firstLine" name="firstLine" lay-verify="required" lay-reqText="请输入一本线" placeholder="请输入一本线" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="width: 200px">
            <input type="text" id="secondLine" name="secondLine" lay-verify="required" lay-reqText="请输入二本线" placeholder="请输入二本线" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="width: 200px">
            <select name="classesId">
                <option value="">请选择班级</option>
            </select>
        </div>
        <div class="layui-input-inline" style="width: 200px">
            <select name="testId">
                <option value="">请选择哪一次考试</option>
            </select>
        </div>
        <div class="layui-input-inline">
            <button  class="layui-btn" lay-submit lay-filter="doSearch">查询</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>

</form>

<!-- 表格 -->
<table class="layui-hide" id="schScore" lay-filter="schScore"></table>

</body>
<script src="/layui.js" charset="utf-8"></script>
<script>
    layui.use(['table','layer','form','laydate'],function(){
        let table = layui.table;
        let layer=layui.layer;
        let form=layui.form;
        let laydate=layui.laydate;

        //用ajax查询班级
        $.get("/teacher/queryClass",function (res) {
            let selectInfo="";
            //循环遍历集合
            for (let i = 0; i <res.data.length ; i++) {
                selectInfo +="<option value='"+res.data[i].id+"'>"+res.data[i].classesName+"</option>"
            }
            //追加到下拉框列表中
            $("[name='classesId']").append(selectInfo);

            //更新渲染select下拉框
            form.render("select");
        },"json");

        //用ajax查询科目
        $.get("/teacher/querySubject",function (res) {
            let selectInfo="";
            //循环遍历集合
            for (let i = 0; i <res.data.length ; i++) {
                selectInfo +="<option value='"+res.data[i].id+"'>"+res.data[i].subjectName+"</option>"
            }
            //追加到下拉框列表中
            $("[name='subjectId']").append(selectInfo);

            //更新渲染select下拉框
            form.render("select");
        },"json");

        //用ajax查询老师姓名
        $.get("/teacher/queryAllTeacherName",function (res) {
            let selectInfo="";
            //循环遍历集合
            for (let i = 0; i <res.data.length ; i++) {
                selectInfo +="<option value='"+res.data[i].id+"'>"+res.data[i].teachersName+"</option>"
            }
            //追加到下拉框列表中
            $("[name='teacherId']").append(selectInfo);

            //更新渲染select下拉框
            form.render("select");
        },"json");

        //搜索事件
        form.on("submit(doSearch)",function (data) {
            $.post("/teacher/enrollmentRate",data.field,function (res) {
                if (res.success=="true"){

                    let tableInfo=table.render({
                        elem: '#schScore'
                        ,url:'/teacher/enrollmentRate'
                        ,title: '全校学生升学率统计表'
                        ,totalRow: true
                        ,cols: [  [
                            {field:'id', title:'编号 ', width:80, fixed: 'left', unresize: true, sort: true,align:'center'}
                            ,{field:'classes',width:120, title: '班级',align:'center',templet:function (res) {
                                    return res.classes.classesName;
                                }}
                            ,{field:'teachers',width:150, title: '班主任',align:'center',templet:function (res) {
                                    return res.teachers.teachersName;
                                }}
                            ,{field:'classAve', width:120,title: '班级平均分',align:'center'}
                            ,{field:'schoolAve', width:120,title: '全校平均分',align:'center'}
                            ,{field:'keyLine', width:120,title: '重点本科线',align:'center'}
                            ,{field:'keyUndergraduateNum', width:120,title: '重点本科人数',align:'center'}
                            ,{field:'keyUndergraduateRate', width:120,title: '重点率', sort: true,align:'center'}
                            ,{field:'firstLine', width:120,title: '一本线', sort: true,align:'center'}
                            ,{field:'firstUndergraduateNum', width:120,title: '一本人数', sort: true,align:'center'}
                            ,{field:'firstUndergraduateRate', width:120,title: '一本率', sort: true,align:'center'}
                            ,{field:'secondLine', width:120,title: '二本线', sort: true,align:'center'}
                            ,{field:'secondUndergraduateNum', width:120,title: '一本人数', sort: true,align:'center'}
                            ,{field:'secondUndergraduateRate', width:120,title: '二本率', sort: true,align:'center'}
                        ]  ]
                        ,page: true
                        ,response: {
                            statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0
                        }
                        ,parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
                            return {
                                "code": res.code, //解析接口状态
                                "msg": res.msg, //解析提示文本
                                "count": res.data.count, //解析数据长度
                                "data": res.data.items //解析数据列表
                            };
                        }
                    });
                    alert(res.msg);
                }

            });

            // tableInfo.reload({
            //     where:data.field,
            //     page:{
            //         curr:1
            //     }
            // });
            return false;
        })
    });
</script>
</html>